export default function useCompleteContent() {
  // 获取复合输入框的完整内容结构
  const getCompleteContent = (editableDiv, hasSpn) => {
    if (!editableDiv) return null

    const content = {
      htmlContent: editableDiv.innerHTML,
      textContent: editableDiv.innerText,
      inputs: [],
      selects: [],
      numberInputs: [],
      dateInputs: [],
      textNodes: [],
    }

    // 获取所有输入框
    const inputs = editableDiv.querySelectorAll(`.inline-input`)
    inputs.forEach((input, index) => {
      content.inputs.push({
        index: index,
        placeholder: input.placeholder,
        value: hasSpn ? `<span>${input.value}</span>` : input.value,
        type: input.type,
        disabled: input.disabled,
        className: input.className,
      })
    })

    // 获取所有数字输入框
    const numberInputs = editableDiv.querySelectorAll('input[type="number"]')
    numberInputs.forEach((numberInput, index) => {
      content.numberInputs.push({
        index: index,
        placeholder: numberInput.placeholder,
        value: hasSpn ? `<span>${numberInput.value}</span>` : numberInput.value,
        type: numberInput.type,
        disabled: numberInput.disabled,
        className: numberInput.className,
      })
    })

    // 获取所有日期输入框
    const dateInputs = editableDiv.querySelectorAll('input[type="date"]')
    dateInputs.forEach((dateInput, index) => {
      content.dateInputs.push({
        index: index,
        placeholder: dateInput.placeholder,
        value: hasSpn ? `<span>${dateInput.value}</span>` : dateInput.value,
        type: dateInput.type,
        disabled: dateInput.disabled,
        className: dateInput.className,
      })
    })

    // 获取所有选择框
    const selects = editableDiv.querySelectorAll('.inline-select')
    selects.forEach((select, index) => {
      content.selects.push({
        index: index,
        value: select.value,
        selectedText: select.options[select.selectedIndex]?.text || '',
        options: Array.from(select.options).map(option => ({
          value: option.value,
          text: option.text,
          selected: option.selected,
        })),
      })
    })

    // 获取所有静态文本
    const textSpans = editableDiv.querySelectorAll('.text-content')
    textSpans.forEach((span, index) => {
      content.textNodes.push({
        index: index,
        text: span.textContent,
        className: span.className,
      })
    })

    return content
  }

  const setCompleteContent = (editableDiv, hasSpn = true) => {
    // 获取复合输入框中的所有内容
    const completeContent = getCompleteContent(editableDiv, hasSpn)
    // console.log('值', completeContent)
    if (completeContent) {
      // console.log('=== 复合输入框完整内容 ===')
      // console.log('HTML内容:', completeContent.htmlContent)
      // console.log('纯文本:', completeContent.textContent)
      // console.log('输入框列表:', completeContent.inputs)
      // console.log('选择框列表:', completeContent.selects)
      // console.log('日期框列表:', completeContent.dateInputs)
      // console.log('文本节点:', completeContent.textNodes)

      // 构建完整的内容字符串（包含所有值）
      let fullContentText = ''
      completeContent.textNodes.forEach((textNode, index) => {
        fullContentText += textNode.text
        // 在文本节点之间插入对应的输入框值
        if (index < completeContent.inputs.length) {
          fullContentText += completeContent.inputs[index]?.value || ''
        }
        if (index < completeContent.selects.length) {
          fullContentText += completeContent.selects[index]?.selectedText || ''
        }
        if (index < completeContent.numberInputs.length) {
          fullContentText += completeContent.numberInputs[index]?.value || ''
        }
        if (index < completeContent.dateInputs.length) {
          fullContentText += completeContent.dateInputs[index]?.value || ''
        }
      })

      return fullContentText
    }
  }

  // 解析文本中的span标签和输入框
  const parseReasonText = text => {
    const segments = []
    // 使用正则匹配 span 标签和非 span 内容
    // 添加 s 标志使 . 匹配包括换行符的任何字符
    const spanPattern = /<span>([\s\S]*?)<\/span>|([^<>]+)/g
    let match

    while ((match = spanPattern.exec(text)) !== null) {
      if (match[1] !== undefined) {
        // 匹配到 span 标签内容，作为普通文本
        // if (match[1].trim()) {
        segments.push({
          type: 'text',
          content: match[1],
        })
        // }
      } else if (match[2] !== undefined) {
        // 匹配到非 span 内容，作为输入框
        if (match[2].trim()) {
          segments.push({
            type: 'input',
            value: match[2].trim().replace(/X/g, ''),
            placeholder: '请输入',
          })
        }
      }
    }

    return segments
  }

  return {
    setCompleteContent,
    getCompleteContent,
    parseReasonText,
  }
}
